<template>
    <div style="height: 50px;line-height: 50px;border-bottom: 1px solid #ccc;display: flex">
        <div style="width:200px ;padding-left: 30px;font-weight: bold;color: blue">er学习后台管理</div>
        <div style="flex: 1 "></div>
        <div style="width:100px ">
            <el-dropdown style="color: blue;margin-top: 18px">
                <span class="el-dropdown-link" v-if="user">
                    {{ user.nickName }}
<!--                    <i class="el-icon-arrow-down el-icon&#45;&#45;right"></i>-->
<!--                    <el-icon class="el-icon&#45;&#45;right">-->
<!--                        <arrow-down/>-->
<!--                    </el-icon>-->
                </span>
                <template #dropdown>
                    <el-dropdown-menu>
                        <el-dropdown-item @click = "$router.push('/index2')">返回主页</el-dropdown-item>
                        <el-dropdown-item @click = "$router.push('/login')">退出系统</el-dropdown-item>
                    </el-dropdown-menu>
                </template>
            </el-dropdown>
        </div>
    </div>

</template>

<script>
    import router from "../router/index.js"
    export default {
        name: "Header",
        data(){
            return {
                user: JSON.parse(sessionStorage.getItem("user"))
            }
        },
    }
</script>

<style scoped>

</style>